<script setup lang="ts"> 
import { ref } from 'vue'
import { onLoad} from '@dcloudio/uni-app'
import {checkCoupon,writeOffCoupon} from '@/apis/home/index'
const ishx = ref(false)
const securityCode = ref('')
const couponData = ref({})
const entityCouponId = ref('')
const { divTenThousand } = useConvert()

const couponIndexType = {
  PRICE_DISCOUNT: '无门槛折扣券',
  PRICE_REDUCE: '无门槛现金券',
  REQUIRED_PRICE_DISCOUNT: '满折券',
  REQUIRED_PRICE_REDUCE: '满减券',
}

enum ProductType {
  ALL = 'ALL',
  SHOP_ALL = 'SHOP_ALL',
  ASSIGNED = 'ASSIGNED',
  ASSIGNED_NOT = 'ASSIGNED_NOT',
}

onLoad((params) => {
  uni.$emit('updateTitle')
  securityCode.value = params.id
  checkCouponData()
})
async function checkCouponData(){
	const {code,data} = await checkCoupon(securityCode.value)
	if(code !=200){
		uni.showToast({
			icon:'none',
			title:'获取优惠券失败'
		})
		return 
	}
	couponData.value = data
	entityCouponId.value = data.id
}
const isDiscountFn =(status)=>{
  return ['PRICE_DISCOUNT', 'REQUIRED_PRICE_DISCOUNT'].includes(status)
}
/**
 * 无门槛格式化
 * @param {ApiCouponVO} item
 */
const formattingPrice = (item)=> {
  const isD = isDiscountFn(item.type)
  if (!isD) {
    return divTenThousand(item.amount).toString()
  }
  return item.discount
}
function formattingName(item) {
  console.log(item)
  if (item.productType === ProductType.ALL) {
    return '全场商品通用'
  }
  const name = item.shopName ? item.shopName : ''
  return '限' + name + '可用'
}
//  * @param REQUIRED_PRICE_REDUCE 满减券
//  * @param REQUIRED_PRICE_DISCOUNT 满折券
function initCouponType() {
  let couponType: string
  if (['无门槛折扣券', '无门槛现金券'].includes(couponIndexType[couponData.value.type])) {
    couponType = couponIndexType[couponData.value.type]
  } else {
    couponType = `满${divTenThousand(couponData.value.requiredAmount)}可使用`
  }
  return couponType
}
const writeOff = async()=>{
	uni.showModal({
	  title: '提示',
	  content: '确认要进行核销吗？',
	  success: async ({ confirm }) => {
	    if (confirm){
			const {code,data} = await writeOffCoupon(entityCouponId.value)
			if(code !=200){
				uni.showToast({
					icon:'none',
					title:'核销失败'
				})
				return 
			}
			ishx.value = true
		}
	  },
	})
	
}
</script>

<template>
	<view class="content">
		<view class="content-card" v-if="!ishx">
			<view class="item">
				<text class="label">活动名称:</text>
				<text>{{couponData.name}}</text>
			</view>
			<view class="item">
				<view class="label">活动规则:</view>
				<view class="item-content">
					<view class="item">
						<text class="item-label">优惠券类型</text>
						<text>{{couponIndexType[couponData.type]}}</text>
					</view>
					<view class="item">
						<text class="item-label">优惠券规则</text>
						<text>{{formattingPrice(couponData)}}{{isDiscountFn(couponData.type) ? '折' : '元'}}{{initCouponType()}}</text>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="label">使用时间:</view>
				<view class="item-content">
					<view class="item">
						<text class="item-label">开始时间</text>
						<text>{{couponData.startDate}}</text>
					</view>
					<view class="item">
						<text class="item-label">结束时间</text>
						<text>{{couponData.endDate}}</text>
					</view>
				</view>
			</view>
			<view class="btn">
				<u-button type="primary" @click="writeOff">核销</u-button>
			</view>
			
		</view>
		<view  v-else class="nodata">
			<u-image width="330rpx" height="248rpx" src="../../assets/img/yhx.png" ></u-image>
		</view>
		
	</view>
</template>

<style scoped lang="scss">
	.content {
		padding: 30rpx;
		.content-card {
			background: #ffffff;
			border-radius: 20rpx;
			padding:30rpx;
		}
	}
	.item {
		margin-bottom: 30rpx;
		.label {
			font-weight: bold;
			margin-right: 20rpx;
		}
		.item-content {
			margin-left: 120rpx;
		}
		.item-label {
			margin-right: 30rpx;
		}
	}
	.btn {
		margin-top: 200rpx;
		padding:0 40rpx;
	}
	.nodata {
		display: flex;
		justify-content: center;
		margin-top: 30%;
	}
</style>